<%@ page language="java" pageEncoding="utf-8" contentType="text/html; charset=utf-8"%>
<%@ include file="../include/taglib.jsp" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head> 
  	<title>添加包厢</title>
  	<%@ include file="../include/jsCss.jsp" %> 
  </head>
  <body>
	  	<form action="mealbox!mealBoxSaveOrUpdate.html" method="post" id="frmMealBox">
			添加包厢
			<hr>
			<table border="1">
				<tr>
					<td>上传图片</td>
					<td><iframe src="${webUrl }/images!imageUpload2.html?width=40&height=40" width="100%" height="250" scrolling="no" frameborder="0" style="border: 0px;"></iframe> </td>
				</tr>
				<tr>
					<td>名称</td>
					<td>
						<input type="text" name="name" id="name" value="${mealBoxDto.name }" onblur="javascript:boxNameVal();"/>
						<span id="boxName"></span>
						<input type="hidden" name="id" value="${mealBoxDto.id }"/>
					</td>
				</tr>
				<tr>
					<td>
						类型
					</td>
					<td>
						<select name="type">
							<s:if test="mealBoxDto.type == 0">
								<option value="0" selected="selected">包厢</option>
							</s:if>
							<s:else>
								<option value="0">包厢</option>
							</s:else>
							<s:if test="mealBoxDto.type == 1">
								<option value="1" selected="selected">大厅</option>
							</s:if>
							<s:else>
								<option value="1">大厅</option>
							</s:else>
							
						</select>
					</td>
				</tr>
				<tr>
					<td>人数</td>
					<td>
						<input type="text" name="peopleNumber" value="${mealBoxDto.peopleNumber}" onblur="javascript:valPeopleNumber();"/>
						<span id="peopleNum"></span>
					</td>
				</tr>
				<tr>
					<td>最低消费</td>
					<td>
						<input type="text" name="lowConsume" value="${mealBoxDto.lowConsume }" onblur="javascript:lowConsumeVal();"/>元
						<span id="lowConsumeNum"></span>
					</td>
				</tr>
				<tr>
					<td>备注</td>
					<td><textarea rows="5" cols="20" name="remark">${mealBoxDto.remark }</textarea></td>
				</tr>
				<tr>
					<td colspan="2"><input type="button" value="保存" onclick="valNumber();"/> </td>
				</tr>
			</table>
		 </form>
	</body>
</html>
<script type="text/javascript">
	function valNumber(){

		var boxNameValue = $("#name").val();
		var number = $("input[name='peopleNumber']").val();//人数
		var low = $("input[name='lowConsume']").val();//最低消费额
		
		//包厢名称不能为空
		if($.trim(boxNameValue) == ''){
			$("#boxName").show();
			$("#boxName").text("请输入名称");
			$("#boxName").css('color','red');
			return;
		}else{
			$("#boxName").hide();
		}
		
		//人数验证
		if($.trim(number) == ''){
			$("#peopleNum").show();
			$("#peopleNum").text("请输入人数");
			$("#peopleNum").css('color','red');
			return;
		}else{
			if(isNaN(number)){
				$("#peopleNum").show();
				$("#peopleNum").text("请输入数字");
				$("#peopleNum").css('color','red');
				return;
			}else{
				$("#peopleNum").hide();
			}
		}
		
		//最低消费额
		if($.trim(low) == ''){
			$("#lowConsumeNum").show();
			$("#lowConsumeNum").text("(请输入最低消费金额)");
			$("#lowConsumeNum").css('color','red');
			return;
		}else{
			if(isNaN(low)){
				$("#lowConsumeNum").show();
				$("#lowConsumeNum").text("(请输入数字)");
				$("#lowConsumeNum").css('color','red');
				return;
			}else{
				$("#lowConsumeNum").hide();
			}
		}
		
		$("#frmMealBox").submit();
	}
	
	//包厢名称 必须要填写
	function boxNameVal(){
		var boxNameValue = $("#name").val();//名称
		
		//名称
		if($.trim(boxNameValue) == ''){
			$("#boxName").show();
			$("#boxName").text("请输入名称");
			$("#boxName").css('color','red');
			return;
		}else{
			$("#boxName").hide();
		}
		
	}
	
	//验证输入人数
	function valPeopleNumber(){
		var number = $("input[name='peopleNumber']").val();//人数
		
		if($.trim(number) == ''){
			$("#peopleNum").show();
			$("#peopleNum").text("请输入人数");
			$("#peopleNum").css('color','red');
			return;
		}else{
			if(isNaN(number)){
				$("#peopleNum").show();
				$("#peopleNum").text("请输入数字");
				$("#peopleNum").css('color','red');
				return;
			}else{
				$("#peopleNum").hide();
			}
		}
	}
	
	//最低消费额
	function lowConsumeVal(){
		var low = $("input[name='lowConsume']").val();
		
		if($.trim(low) == ''){
			$("#lowConsumeNum").show();
			$("#lowConsumeNum").text("(请输入最低消费金额)");
			$("#lowConsumeNum").css('color','red');
		}else{
			if(isNaN(low)){
				$("#lowConsumeNum").show();
				$("#lowConsumeNum").text("(请输入数字)");
				$("#lowConsumeNum").css('color','red');
				return;
			}else{
				$("#lowConsumeNum").hide();
			}
		}
	}
</script>